@charset "utf-8";
* {
    padding: 0;
    margin: 0;
    text-decoration: none;
    list-style: none;
    
    color: #000;
    font-size: 0;
}
@mixin clear_both {
    &::after {
        content: "";
        display: block;
        visibility: hidden;
        clear: both;
    }
}
.TK_warp {
    width: 1280px;
    margin: 0 auto;
}
.head_warp {
    .top_one {
        background: #dfdfde;
        line-height: 38px;
        color: #000;
        p {
            margin-left: 192px;
            float: left;
            font-size: 14px;
        }
        a {
            font-size: 14px;
            float: right;
            &:first-of-type {
                margin-right: 161px;
            }
            &:last-of-type {
                margin-right: 20px;
            }
        }
        @include clear_both;
    }
    .top_bott {
        .logo {
            margin-left: 154px;
            padding-top: 2px;
            float: left;
        }
        .navi {
            margin-left: 107px;
            li {
                margin-left: 2px;
                height: 94px;
                display: inline-block;
                position: relative;
                width: 80px;
                transition: all .7s ease;
                p {
                    
                    font-size: 14px;
                    line-height: 14px;
                    text-align: center;
                    margin-top: 30px;
                    color: #838383;
                    &:last-of-type {
                        margin-top: 8px;
                    }
                }
                span {
                    position: absolute;
                    background: #faf8f8;
                    top: 0;
                    left: 0;
                    display: block;
                    width: 0;
                    height: 91px;
                    border-bottom: 3px solid #3c9cd3;
                    transition: all .7s ease;
                    overflow: hidden;
                    &::before {
                        content: attr(mtitle);
                        margin-top: 30px;
                    }
                    &::after {
                        content: attr(ntitle);
                        margin-top: 8px;
                    }
                    &::after,
                    &::before {
                        display: block;
                        white-space: nowrap;
                        
                        font-size: 14px;
                        line-height: 14px;
                        text-align: center;
                        width: 80px;
                        transition: all .7s ease;
                    }
                }
                &:hover {
                    width: 94px;
                    span {
                        width: 94px;
                        &::after,
                        &::before {
                            width: 94px;
                        }
                    }
                }
                &[focl]{
                    width: 94px;
                    span{
                        width: 94px;
                        &::after,
                        &::before{
                            width: 94px;
                        }
                        
                    }
                }
            }
            float: left;
        }
        @include clear_both;
    }
}
.footer_warp {
    text-align: center;
    .footer_top {
        height: 102px;
        background: #3c9cd3;
        .footer_top_t {
            line-height: 20px;
            padding-top: 18px;
            p {
                display: inline-block;
                color: white;
                font-size: 12px;
                letter-spacing: 2px;
            }
            i {
                color: #48b9fa;
                display: inline-block;
                margin-left: 13px;
                vertical-align: middle;
                transition: color 0.5s ease;
                &:hover {
                    color: white;
                }
            }
            .icon-weixin {
                font-size: 21px;
                margin-top: 2px;
            }
            .icon-QQ {
                font-size: 18px;
            }
            .icon-iconfontxinlang {
                margin-left: 11px;
                font-size: 19px;
                margin-top: 1px;
            }
        }
        .footer_top_b {
            ul {
                font-size: 0;
                margin-top: 20px;
                li {
                    display: inline-block;
                    color: white;
                    &::after {
                        content: "·";
                        margin-top: 2px;
                        font-size: 16px;
                        margin: 0 6px;
                    }
                    &:last-of-type::after {
                        display: none;
                    }
                    a {
                        color: white;
                        font-size: 12px;
                        letter-spacing: 1px;
                    }
                }
            }
        }
    }
    .footer_boot {
        height: 35px;
        background: #1c1b29;
        p {
            color: white;
            font-size: 12px;
            line-height: 35px;
            letter-spacing: 1px;
        }
    }
}
